$(function() {
    var tbody = $("tbody");
    var sheet = $(".sheet");
    var file = $(".file");
    var form = $("form");
    var page = 0;
    var pageCount = 8;
    var totalPage = 1;
    var changeStar = function(stars, num) {
            for (var i = 0; i < num; i++) {
                $(stars[i]).css("background-position", "0 -32px");
            }
            for (var i = num; i < stars.length; i++) {
                $(stars[i]).css("background-position", "0 0");
            }
        }
        //归档
    var showlists = function(task) {
        tbody.empty();
        for (var i = 0; i < task.length; i++) {
            var tr = "<tr index=" + i + "  _id=" + task[i]._id + "><td>" + task[i].name + "</td><td>" + task[i].time + "</td><td>" + "<div index='1' class='star'></div><div index='2' class='star'></div><div index='3' class='star'></div><div index='4' class='star'></div><div index='5' class='star'></div>" + "</td><td>" + task[i].finish + "</td><td>" + "观看模式" + "</td></tr>";
            var jTr = $(tr);
            var stars = jTr.find(".star");
            changeStar(stars, task[i].star);
            tbody.append(jTr);
        }
    }
    var showDatas = function(data) {
        if (data.status != 0) {
            alert("数据库出错");
        } else {
            totalPage = data.totalPage;
            page = data.page;
            if (data.length <= 0) {
                var noMessage = $(".no-message");
                noMessage.show();
            } else {
                var noMessage = $(".no-message");
                noMessage.hide();
                showlists(data.data);
            }
        }
    }
    var getTaskDatas = function() {
        $.ajax({
            url: "/getTaskDatas",
            method: "get",
            data: {
                page: page,
                pageCount: pageCount
            },
            success: function(data) {
                showDatas(data);
            }
        })
    }

    //主页
    var showlist = function(task) {
        tbody.empty();
        for (var i = 0; i < task.length; i++) {
            var tr = "<tr index=" + i + "  _id=" + task[i]._id + "><td>" + task[i].name + "</td><td>" + task[i].time + "</td><td>" +
                "<div index='1' class='star'></div><div index='2' class='star'></div><div index='3' class='star'></div><div index='4' class='star'></div><div index='5' class='star'></div>" + "</td><td class='td'>" + task[i].finish + "</td><td>" + "<button class='btn-del'>删除</button>" + "(可修改)" + "</td></tr>";
            var jTr = $(tr);
            var stars = jTr.find(".star");
            stars.on("mouseenter", function(e) {
                var star = $(this);
                var stars = star.parent().find(".star");
                var index = star.attr("index");
                changeStar(stars, index);
            });
            stars.on("mouseleave", function(e) {
                var star = $(this);
                var index = star.parents("tr").attr("index");
                var stars = $(this).parent().find(".star");
                changeStar(stars, task[index].star);
            });

            stars.on("click", function(e) {
                var star = $(this);
                var id = star.parents("tr").attr("_id");
                var stars = $(this).parent().find(".star");
                var starIndex = star.attr("index");
                $.ajax({
                    url: "/changeStar",
                    method: "get",
                    data: {
                        id: id,
                        starIndex: starIndex,
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showData(data);
                    }
                })
            });

            changeStar(stars, task[i].star);
            // if (task[i].finish == "未完成") {
            tbody.append(jTr);
            // }
        }
        //删除
        var btnDels = tbody.find(".btn-del");
        btnDels.on("click", function(e) {
                var btn = $(this);
                var id = btn.parents("tr").attr("_id");
                $.ajax({
                    url: "/del",
                    method: "get",
                    data: {
                        id: id,
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showData(data);
                    }
                })
            })
            //修改
        $(".td").on("dblclick", function(e) {
            var hInput = "<select class='input'><option>未完成</option><option>合格</option><option>良好</option><option>优秀</option></select>";
            var jInput = $(hInput);
            var td = $(this);
            td.append(hInput);
            $(".input").focus();
            $(".input").on("blur", function(e) {
                td.text($(".input").val());
                $(".input").remove();
                var id = td.parents("tr").attr("_id");
                var newTd = td.text();
                // console.log(td.text());
                $.ajax({
                    url: "/change",
                    method: "get",
                    data: {
                        id: id,
                        newTd: newTd,
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showData(data);
                    }
                })

            })

        })
    };
    var showData = function(data) {
        if (data.status != 0) {
            alert("数据库出错");
        } else {
            console.log(data.totalPage);
            totalPage = data.totalPage;
            page = data.page;
            if (data.length <= 0) {
                var noMessage = $(".no-message");
                noMessage.show();
            } else {
                var noMessage = $(".no-message");
                noMessage.hide();
                showlist(data.data);
            }
        }
    }
    var getTaskData = function() {
        $.ajax({
            url: "/getTaskData",
            method: "get",
            data: {
                page: page,
                pageCount: pageCount
            },
            success: function(data) {
                console.log(data);
                showData(data);
            }
        })
    }


    //添加
    var btnAdd = form.find(".btn-add");
    btnAdd.on("click", function(e) {
            e.preventDefault();
            var newTask = {
                name: $(".task-name").val(),
                time: $(".task-time").val(),
                star: $(".task-star").val(),
                finish: $(".task-finish").val(),
            };
            console.log($(".task-name").val().length);
            if ($(".task-name").val().length < 7) {
                $.ajax({
                    url: "/add",
                    method: "get",
                    data: {
                        newTask: newTask,
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showData(data);
                    }
                })
            }

        })
        // var display = form.css("display");
    $(".addd").on("click", function(e) {
        form.css("display", "block");
    })

    $(".miss").on("click", function(e) {
        form.css("display", "none");
    })




    file.on("click", function(e) {
        $(".btn-ss").css("display", "none");
        $(".btn-xs").css("display", "none");
        $(".btn-sf").css("display", "block");
        $(".btn-xf").css("display", "block");
        //下一页
        var btnX = $(".btn-xf");
        var btnS = $(".btn-sf");
        btnX.on("click", function(e) {
                page++;
                // $(".btn-sf").css("display", "block");
                // if (page >= totalPage - 1) {
                //     $(".btn-xf").css("display", "none");
                //     page = totalPage - 1;
                // }
                $.ajax({
                    url: "/getTaskDatas",
                    method: "get",
                    data: {
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showDatas(data);
                    }
                })
            })
            //上一页


        btnS.on("click", function(e) {
            page--;
            // if (page <= 0) {
            //     $(".btn-sf").css("display", "none");
            //     page = 0;
            // }
            // $(".btn-xf").css("display", "block");
            $.ajax({
                url: "/getTaskDatas",
                method: "get",
                data: {
                    page: page,
                    pageCount: pageCount
                },
                success: function(data) {
                    showDatas(data);
                }
            })
        })
        getTaskDatas();
    })
    sheet.on("click", function(e) {
        page = 0;
        $(".btn-sf").css("display", "none");
        $(".btn-xf").css("display", "none");
        $(".btn-ss").css("display", "block");
        $(".btn-xs").css("display", "block");
        //下一页
        var btnX = $(".btn-xs");
        var btnS = $(".btn-ss");
        btnX.on("click", function(e) {
                page++;
                $.ajax({
                    url: "/getTaskData",
                    method: "get",
                    data: {
                        page: page,
                        pageCount: pageCount
                    },
                    success: function(data) {
                        showData(data);

                    }
                })
            })
            //上一页
        $(".btn-s").css("display", "none");
        btnS.on("click", function(e) {
            page--;
            $.ajax({
                url: "/getTaskData",
                method: "get",
                data: {
                    page: page,
                    pageCount: pageCount
                },
                success: function(data) {
                    showData(data);

                }
            })
        })
        getTaskData();
    })
    sheet.click();
})